
function loadContact(linker)
{
	var url="/api/contact?by=location&location="+linker.id;
	$("#contact_list").html("<div id='content'>Loading...</div>");

	$.getJSON(url, function (data) {
        if (data.length > 0) {
          var results = data;
          var content="";
          for (var i=0; i < results.length; i++) {
            // Display each result however you wish 
            content += " <a href='#' onclick='doContact(this)' contact_code='"+results[i].code+"'><img src='"+results[i].avater_url+"' alt='"+results[i].name+"'/></a> ";
          }
          $("#contact_list").html(content);
        }
      });
	
}
function initialJQueryUI()
{
	$('#dialog').dialog({
		autoOpen: false,
		bgiframe: true,
		width: 800,
		height: 600,
		modal: true,
		buttons: {
			"Close": function() { 
				$(this).dialog("close"); 
			}
		}
	});
}
function doContact(sender)
{
	var contact_code=$(sender).attr('contact_code');
	var url="api/contactDetails?code="+contact_code;
	$('#dialog > p').html("loading...");
	$('#dialog').dialog('open');
	$.getJSON(url, function (data) {
		var html="";
		html+="<div id='dialog_main_frame'><img src='"+data.avater_url+"'align='left'/><div style='margin-left:150px;'><h1>"+data.first_name+" "+data.last_name+" <a href='#' onclick='onShowAlbumFrame(this)' contact_code='"+contact_code+"'><img src='/design/picassa.png'/></a></h1>"+
		data.description+"<hr/>"+
		"<table id='contactDialog'><tr><th>contact method</th><th>contact rate</th><th>operation</th></tr>"+
		"<tr>"+getTrContent("email.png",data.contactInfo.email,data.email_rate)+"</tr>"+
		"<tr>"+getTrContent("phone.gif",data.contactInfo.phoneNumber,data.phone_rate)+"</tr>"+
		"<tr>"+getTrContent("sms.gif",data.contactInfo.phoneNumber,data.sms_rate)+"</tr>"+
		"<tr>"+getTrContent("msn.jpg",getIMInfo(data.contactInfo),data.im_rate)+"</tr>"+
		"<tr>"+getTrContent("sns.png",getOtherContactMethod(data.contactInfo),data.other_contact_rate)+"</tr>"+
		"</table>"+
		"</div></div>"+
		"<div id='dialog_album_frame' style='display:none'><a href='#' onclick='onHideAlbumFrame()' style='text-align:left'>Return</a><p>loading...</p></div>";
		$('#dialog > p').html(html);
		$("#dialog tr:even").addClass("double"); 
		
	}
	);
	return false;
}
function getIMInfo(contactInfo)
{
	return "MSN:"+contactInfo.msn+"<br/>"+
			"Skype:"+contactInfo.skype
}
function getOtherContactMethod(contactInfo)
{
	var result="";
	result+="facebook:"+contactInfo.facebook+"<br/>";
	result+="twitter:"+contactInfo.twitter+"<br/>";
	
	var methods=contactInfo.otherMethods;
	if(methods!=null)
	{
		if(typeof methods.length=='undefined')
		{
			result+=allPrpos(methods);
		}
		else
		{
			for(var i=0;i<methods.length;i++)
			{
				result+=allPrpos(methods[i]);
			}
		}
	}
	return result;
}
function getTrContent(method,data,rate)
{
	return "<td style='text-align:center'><img src='/design/"+method+"' width='35' hight='35'/></td>"+
	"<td>"+data+"</td>"+
	"<td><input type='button' value='make contact("+rate+")' onclick='contactDone(this)'/></td>";
}
//debug function
function allPrpos(obj) { 
    var props = "";
    for(var p in obj){
      if(typeof(obj[p])=="function"){
    	  //dummy
      }else{
      props+= p + ":" + obj[p] + "<br/>";
      }
     }
    return props;
}

function onShowAlbumFrame(sender)
{
	$("#dialog_main_frame").css("display","none");
	$("#dialog_album_frame").css("display","block");
	var url="/api/album?code="+$(sender).attr('contact_code');
	var html='"';
	$.getJSON(url, function (results) {
    if (results.length > 0) {
    	html='<div class="demo"><div id="main_image"></div>'+
        '<ul class="gallery">';
        for (var i=0; i < results.length; i++) {
          html +='<li><img alt="" src="'+results[i]+'" /></li>';
        }
        html+='</ul>'+
    	'<p class="nav"><a href="#" onclick="$.galleria.prev(); return false;">&laquo; previous</a> | <a href="#" onclick="$.galleria.next(); return false;">next &raquo;</a></p>'+
    	'</div>';
        $("#dialog_album_frame > p").html(html);
    	$('ul.gallery').galleria({
    		history   : true, // activates the history object for bookmarking, back-button etc.
    		clickNext : true, // helper for making the image clickable
    		insert    : '#main_image', // the containing selector for our main image
    		onImage   : function(image,caption,thumb) { // let's add some image effects for demonstration purposes
    			//scale image
    			
    			ScaleImg(image,700,300);
    			
    			// fade in the image & caption
    			if(! ($.browser.mozilla && navigator.appVersion.indexOf("Win")!=-1) ) { // FF/Win fades large images terribly slow
    				image.css('display','none').fadeIn(1000);
    			}
    			caption.css('display','none').fadeIn(1000);
    			
    			// fetch the thumbnail container
    			var _li = thumb.parents('li');
    			
    			// fade out inactive thumbnail
    			_li.siblings().children('img.selected').fadeTo(500,0.3);
    			
    			// fade in active thumbnail
    			thumb.fadeTo('fast',1).addClass('selected');
    			
    			// add a title for the clickable image
    			image.attr('title','Next image >>');
    			
    		},
    		onThumb : function(thumb) { // thumbnail effects goes here
    			
    			// fetch the thumbnail container
    			var _li = thumb.parents('li');
    			
    			// if thumbnail is active, fade all the way.
    			var _fadeTo = _li.is('.active') ? '1' : '0.3';
    			
    			// fade in the thumbnail when finnished loading
    			thumb.css({display:'none',opacity:_fadeTo}).fadeIn(1500);
    			
    			// hover effects
    			thumb.hover(
    				function() { thumb.fadeTo('fast',1); },
    				function() { _li.not('.active').children('img').fadeTo('fast',0.3); } // don't fade out if the parent is active
    			)
    		}
    	});  
    
    }
    });
	

}
function onHideAlbumFrame()
{
	$("#dialog_main_frame").css("display","block");
	$("#dialog_album_frame").css("display","none");
}
function ScaleImg(imageObj,boxWidth,boxHeight)
{
	var imgWidth=imageObj.width();
	var imgHeight=imageObj.height();
	if((boxWidth/boxHeight)>=(imgWidth/imgHeight))
	{
		
		imageObj.width((boxHeight*imgWidth)/imgHeight);
		imageObj.height(boxHeight);
		var margin=(boxWidth-imageObj.width())/2;
		imageObj.css("margin-left",margin);
	}
	else
	{
		imageObj.width(boxWidth);
		imageObj.height((boxWidth*imgHeight)/imgWidth);
		var margin=(boxHeight-$imagObj.height())/2;
		imageObj.css("margin-top",margin);
	}
}
